<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<script src="js/informationPage.js"></script>

<!-- 

        운동 정보 페이지

 -->
<div id="informationPage">
    <div id="informationPage-head">
        <c:if test="${exercise == 'H'}">
          <span>홈 트레이닝</span>
        </c:if>
        <c:if test="${exercise == 'W'}">
          <span>웨이트 트레이닝</span>
        </c:if>
        <c:if test="${exercise == 'Y'}">
          <span>요가</span>
        </c:if>
        <c:if test="${exercise == 'S'}">
          <span>스트레칭</span>
        </c:if>
        <c:if test="${exercise == 'D'}">
          <span>다이어트</span>
        </c:if>
        <c:if test="${exercise == 'A'}">
          <span>유산소운동</span>
        </c:if>
        <div id="informationPage-head-caption">
           <div>
                <span>운동 부위 :</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">전체</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">가슴</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">등</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">어깨</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">하체</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">삼두</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">이두</span> 
                <span style="color: blue;" onclick="foodIngestPurposeSelectList(this.textContent)">복근</span> 
           </div>
           <div>
                <span>운동 목적:</span> <span>헬스장의 기구 혹은 맨몸 운동을 통해 근력과 체력을 증진시킬 수 있다.</span>
           </div>
        </div>
    </div>
    <div id="informationPage-contents">
    <c:forEach var="exerciseList" items="${ exerciseList}">
        <div>
           <div id="informationImage">
           
           </div>  
           <div>
                <div id="informationPage-contents-top">
                    <div>
                        <form>
                            <span style="font-weight: bold; font-size: 20px; padding: 0 0 0 12px; display: inline-block; margin-top: 8px; }">${exerciseList.exerciseName }</span>
                        </form>  
                    </div>
                </div> 
                <div>
                    <div class="information-div">
                        <span>부위 :</span><span>${exerciseList.exerciseRegio }</span>
                        <span>개수 :</span><span>${exerciseList.exerciseAverageNum }</span>
                        <span>세트수 :</span><span>${exerciseList.exerciseAverageSetnum}</span>
                    </div>
                    <div class="information-div">
                        <span>설명 :</span> <span>${exerciseList.exerciseInfomation }</span>
                    </div>
                </div> 
           </div>  
           <div>
                <div><span><button style="width: 78px; height: 33px;" onclick="javascript:contentsKeep();">담기</button></span></div>
           </div>  
        </div>
    </c:forEach> 
    </div>
    <div id="informationPage-bottom"></div>
</div>